<template>
  <el-dialog v-model="formShow" title="新增表单" width="550">
    <el-select
        v-model="querySelect"
        filterable
        remote
        reserve-keyword
        placeholder="搜索表单..."
        remote-show-suffix
        :collapse-tags="false"
        :remote-method="queryData"
        :loading="loading"
        style="width: 100%"
    >
      <el-option
          v-for="item in queryOptions"
          :key="item.id"
          :label="item.name"
          :value="item.id"
      />
    </el-select>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="formShow = false">取消</el-button>
        <el-button type="primary" @click="handlerOk">确定</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script>
import {searchHissForm} from "@/api/BusinessForDesignApi";

export default {
  name: "AddHissFormDialog",
  props:{
    tenant:{
      type:String,
      default:''
    },
    ok:{
      type:Function,
      default:null
    }
  },
  data() {
    return {
      loading:false,
      queryOptions:[],
      querySelect:'',
      formShow:false
    }
  },
  methods: {
    show(){
      this.formShow=true
    },
    handlerOk(){
      if(this.ok){
        for (let i = 0; i < this.queryOptions.length; i++) {
          let temp = this.queryOptions[i]
          if(temp.id==this.querySelect){
            temp.type='0'
            console.log(999,temp)
            this.ok(temp)
            break
          }
        }
      }
      this.formShow=false
    },
    queryData(keyword){
      let data = {
        type:'0',
        query:keyword,
        tenantId:this.tenant,
        _tenant:this.tenant
      }
      searchHissForm(data).then(res=>{
        let temp = res.data.result;
        for (let i = 0; i < temp.length; i++) {
          let form = temp[i]
          let count = 0
          for (let j = 0; j < this.queryOptions.length; j++) {
            let opt = this.queryOptions[j]
            if(opt.id==form.id){
              count++
            }
          }
          if(count==0){
            this.queryOptions.unshift(form)
          }
        }
      }).catch(res=>{
        this.$notify.error({title: '提示',message: '调用查询接口失败',showClose: false })})
    }
  }
}
</script>

<style>
.left {
  float: left;
  width: 50%;
}
.el-tree {
  margin-top: 20px;
  min-height: 300px;
  max-height: 300px;
  overflow-y: auto;
}
.el-dialog__body {
  overflow-y: hidden;
  padding-bottom: 0px;
}
.el-tag{
  margin: 10px;
}
.dialog-footer .span {
  color: #adadad;
  font-size: 10px;
  line-height: 32px;
  padding-right: 20px;
}
</style>
